import React from 'react';
import { componentClass, ComponentProps } from '../../../../common/Component';
import './index.less';

export function P(props: React.PropsWithChildren<ComponentProps>){
    return <p className={componentClass(props, 'apps-markdown-font-p')}>
        {props.children}
    </p>
}

export function Em(props: React.PropsWithChildren<ComponentProps>){
    return <em className={componentClass(props, 'apps-markdown-font-em')}>
        {props.children}
    </em>
}

export function Strong(props: React.PropsWithChildren<ComponentProps>){
    return <strong className={componentClass(props, 'apps-markdown-font-strong')}>
        {props.children}
    </strong>
}

export function Del(props: React.PropsWithChildren<ComponentProps>){
    return <del className={componentClass(props, 'apps-markdown-font-del')}>
        {props.children}
    </del>
}

export function U(props: React.PropsWithChildren<ComponentProps>){
    return <u className={componentClass(props, 'apps-markdown-font-u')}>
        {props.children}
    </u>
}


export function Code(props: React.PropsWithChildren<ComponentProps>){
    return <code className={componentClass(props, 'apps-markdown-font-code')}>
        {props.children}
    </code>
}
